<template>
  <div class="quality-modal-box medical-waste">
    <div class="condition-filter-box">
      <button :class="['button',todayActive ? 'btn-active' : '']" @click="checkToday('clear')">今日</button>
      <ekt-date-picker :pickDate="pickDate" @handleChange="searchDate"></ekt-date-picker>
      <el-input v-model="text" @change="postAllData" style="width:18%" placeholder="请输入关键字" clearable />
    </div>
    <div class="table-wrapper">
      <ekt-say-table :showIndex="true" :data="allData" :col="allCol" :isLoading="isLoading" @handle-text-input="showModal"></ekt-say-table>
    </div>

    <ekt-input-dialog
      v-show="visible"
      :canShow="visible"
      :currColName="currColName"
      :currValue="currValue"
      @handle-hide="handleCancel"
      @handle-cancel="handleCancel"
      @handle-save="handleSave"
    />
  </div>
</template>

<script>
import ektDatePicker from './components/ektDatePicker.vue'
import { postControlListUrl, postSubmit2ControlUrl } from '../../common/ajax'
import today from '../../common/today'
export default {
  data() {
    return {
      pickDate: [],   // 日期选择
      isLoading: false,
      text: '',
      allData: [],
      allCol: [
        { label: '质控人', prop: 'uname', width: 100 },
        { label: '质控人账号', prop: 'account', width: 120 },
        { label: '质控人签名', prop: 'step_name', width: 120, attr: 'sign', sign_prop: [{prop:'step_name', tag: 'span'},{prop:'sign_img', tag: 'img'}] },
        { label: '查询时间', prop: 'origin_time', width: 120 },
        { label: '查询界面', prop: 'origin_html', width: 100 },
        { label: '查询内容', prop: 'origin_des', width: 250 },
        { label: '问题/备注', prop: 'comments' },
        { label: '图片', prop: 'picture', attr: 'image', width: 100 },
        { label: '整改措施', prop: 'measure', attr: 'text-input' },
        { label: '效果评估', prop: 'appraise', attr: 'text-input' }
      ],
      currColName: '',
      visible: false,
      currId: '',
      currValue: '',
      todayActive: false,
      oldText: "",
    }
  },
  created(){
    this.checkToday()
  },
  methods: {
    handleCancel(){
      this.visible = false
    },
    handleSave(data){
      jQuery.ajax({
        url: postSubmit2ControlUrl,
        type: 'POST',
        data: JSON.stringify({
          id: this.currId,
          measure: this.currColName === '整改措施' ? data : '',
          appraise: this.currColName === '效果评估' ? data : '',
          text: this.oldText !== '' ? `将 ${this.oldText} 修改为 ${data}` : ''
        }),
        contentType: 'application/json;charset=UTF-8',
        success: function(res){
          if(res.success){
            this.$Message({
                showClose: true,
                message: '成功！',
                type: 'success'
            });
            this.handleCancel();
            this.postAllData();
          }else{
            throwErrorTips('提交失败',res.msg)
          }
        }.bind(this)
      })
    },
    showModal(scope){
      
      this.oldText = scope.row[scope.column.property]
      this.currColName = scope.column.label
      this.currId = scope.row.id
      this.currValue = this.currColName === '整改措施' ? scope.row.measure : scope.row.appraise
      this.visible = true;
    },
    checkToday(text){
      if(text == 'clear') this.pickDate = []
      this.pickDate = [today.otherTime(new Date()), today.otherTime(new Date())]
      this.postAllData()

      this.todayActive = true
    },
    searchDate(item){
        this.pickDate = item;
        let ty = today.init()
        if(this.pickDate.length == 0 || (this.pickDate[0] == ty && this.pickDate[1] == ty)) {
            this.checkToday();
            return;
        }else{
            this.postAllData()
        }
        if(this.todayActive) this.todayActive = false
    },
    postAllData(){
      this.isLoading = true;
      jQuery.ajax({
        url: postControlListUrl,
        type: 'POST',
        data: JSON.stringify({
          st: this.pickDate[0],
          et: this.pickDate[1],
          key: this.text
        }),
        contentType: 'application/json;charset=UTF-8',
        success: function(res){
          if(res.success){
            this.isLoading = false;
            let data = res.data.filter(v => v.origin_html.indexOf("医废") != -1)
            this.allData = data.reverse();
          }
        }.bind(this)
      })
    },
  },
  components:{
    ektDatePicker,
  }
}
</script>

<style lang="less">
.table-wrapper{
  margin-top: 20px;
  height: calc(~'100% - 75px');
}
.table-wrapper .table-box .el-table__body td{
  border: 1px solid #ebeef5;
}
.quality-modal-box{
  height: 100%;
  min-height: auto;
  .condition-filter-box{
    margin: 10px 0 0;
  }
}
</style>